<template>
	<view class="my-main">
		<view v-if="register">
			<view class="top">
				<view class="person-icon">
					<image src="../../static/logo.png"></image>
				</view>
				<view class="name">
					{{name!=''?name:'隐姓埋名'}}
					<image :src="icons.edit"></image>
				</view>
			</view>
			<view>

			</view>
		</view>

		<view class="register" v-if="!register">
			<image
				src="">
			</image>
			<button class="login" v-if="canIUseGetUserProfile" bindtap="getUserProfile" open-type="getUserProfile"
				@click="getUserProfile">授权登录</button>
			<button class="login" v-if="!canIUseGetUserProfile" form-type="submit" open-type="getUserInfo"
				@click="getUserInfo">授权登录</button>
		</view>
	</view>
</template>

<script>
	import icons from '../../js/common/svgs.js'
	import userService from '../../js/service/user/userService.js'
	export default {
		data() {
			return {
				canIUseGetUserProfile: false,
				icons: icons,
				name: '123',
				loginStatus: '',
				login: false,
				register: false,
				openid: '123123'
			};
		},
		methods: {
			getUserProfile(e) {
				let _this = this;
				if (!_this.openid) {
					_this.getUserInfo()
				}
				// 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认
				// 开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
				wx.getUserProfile({
					desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (res) => {
						let userInfo = {
							wxName: res.userInfo.nickName,
							avatar: res.userInfo.avatarUrl,
							openId: _this.openid,
						}
						console.log(res)
						userService.register(userInfo)
					}
				})
			},
			getUserInfo() {
				uni.getUserInfo({
					provider: "weixin",
					success(res) {
						let userInfo = {
							wxName: res.userInfo.nickName,
							avatar: res.userInfo.avatarUrl,
							openId: _this.openid,
						}
						console.log(res)
						userService.register(userInfo)
					}
				})
			}
		},
		mounted() {
			console.log(this.$store.state)
			let _this = this;
			if (wx.getUserProfile) {
				this.canIUseGetUserProfile = true
			}
			uni.login({
				provider: 'weixin',
				success(loginRes) {
					userService.login(loginRes.code, (res) => {
						console.log(res)
						if (res.code == 0) {
							this.openid = res.data.openId
						}
					})
				}
			});
		}
	}
</script>

<style lang="scss">
	.my-main::-webkit-scrollbar {
		display: none
	}

	.my-main {
		box-sizing: border-box;
		padding: 20px;
		overflow: auto;
		height: 100%;

		.register {
			padding: 30px;
			display: flex;
			flex-direction: column;

			image {
				margin-bottom: 40px;
				width: 100%;
			}

		}

		.top {
			display: flex;
			text-align: center;

			.person-icon {
				image {
					width: 3rem;
					height: 3rem;
					padding: 1px;
					border-radius: 3rem;
					background: #ecf0f1;
				}

			}

			.name {
				margin-left: 10px;
				line-height: 3rem;
				font-size: 1.2rem;
				font-weight: bold;
				color: #34495e;
				display: inline-block;
				margin-top: 0.2rem;

				image {
					margin-left: 10px;
					width: 0.8rem;
					height: 0.8rem;
				}
			}
		}


	}
</style>
